<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <meta http-equiv="X-UA-Compatible" content="ie=edge">
    <link rel="stylesheet" href="/css/cartpage.css">
    <script src="/libs/jquery/jquery-1.11.3.min.js"></script>
    <title>购物车页面</title>
</head>
<body>
    <header></header>
    <div class="nav">
        <div class="nav-wrap">
       <!-- 面包屑导航 -->
        </div>
    </div>
          <div class="contain">
              <div class="contain-wrap">
                  <table>
                      <thead>
                      <tr>
                          <th width="200" class="allcheck">
                                <label class="allcheck-label">
                              <input type="checkbox" id="allCheck">&nbsp;&nbsp;全选
                              
                              <span class="check-span">
                                    <span class="check-item"></span>
                                </span>
                            </label>
                            </th>
                          <th width="600">商品名称</th>
                          <th width="160">数量</th>
                          <th width="200">单价</th>
                          <th width="200">价格</th>
                          <th width="200">操作</th>
                      </tr>
                    </thead>
                    <tbody id="template-tbody">
                        <!-- <tr>
                            <td class="checked"><input type="checkbox"></td>
                            <td><a href="javascript:;"><img src="/images/f53b938fe3654781ac56657262ea201a.png" alt="" srcset=""></a><h4>DOTA2 - 熊战士毛绒玩偶</h4><h5>DOTA2正版周边 经典款毛绒 配属超值虚拟</h5></td>
                            <td><div><span>-</span><b>3</b><span>+</span></div></td>
                            <td class="price">￥<span>200.00</span></td>
                            <td class="total-price">￥<span>600.00</span></td>
                            <td class="del"><span>x</span></td>
                        </tr> -->
                       
                    </tbody>
                    <script type="text/html" id="tbody-template">
                        {{each cart shop}}
                        <tr data-id={{shop.id}}>
                            <!-- 设置check属性注意的几点：1.不能用checked="" 因为只有写了checked就好默认勾选2.checked要加单引号 -->
                            <td class="checked">
                                <label class="check-label">
                                <input type="checkbox" {{shop.check? 'checked' : ''}}>
                                <span class="check-span">
                                    <span class="check-item"></span>
                                </span>
                                </label>
                            </td>
                            <td><a href="/html/detail.html?={{shop.id}}"><img src={{shop.imgs[0]}} ></a><h4>{{shop.name.slice(0,14) + '...'}}</h4><h5>{{shop.title}}</h5></td>
                            <td><div><span id="less">-</span><b id="shopNum">{{shop.count}}</b><span id="plus">+</span></div></td>
                            <td class="price">￥<span>{{shop.price}}</span></td>
                            <td class="total-price">￥<span id="partPrice">{{(shop.price * shop.count).toFixed(2)}}</span></td>
                            <td class="del"><span>x</span></td>
                        </tr>
                        {{/each}}
                    </script>
                  </table>
              </div>
          </div>
          <div class="empty-cart">
            <div class="wrap">
                <p>购物车空空的哦~,赶紧<a href="/index.html">去选购</a>吧!</p>
            </div>
        </div>
          <div class="payoff">
              <div class="payoff-wrap">
                  <p>共<span id="totalNumber"></span>件商品，&nbsp;&nbsp;&nbsp;合计：<i>￥<span id="totalPrice">900.00</span></i></p>
                  <a href="javascript:;">去结算</a>
              </div>
          </div>
    <footer></footer>
    <script src="/libs/require/require.min.js" data-main="/js/cartpage.js"></script>
</body>
</html>